<extend name="./Application/Admin/View/base.html" />
<block name="title"><title><?php echo C(APP_NAME);?>PC端管理</title></block>
<block name="stylesheets">
<link rel="stylesheet" href="__PUBLIC__/assets/css/colorbox.css" />
<link rel="stylesheet" href="__PUBLIC__/assets/css/ace.css" class="ace-main-stylesheet" id="main-ace-style" />
</block>
<block name="stylecss">
<style type='text/css'>
	.pages a,.pages span {
	    display:inline-block;
	    padding:5px 9px;
	    margin:0 1px;
	    border:1px solid #f0f0f0;
	}
	.pages a,.pages li {
	    display:inline-block;
	    list-style: none;
	    text-decoration:none; color:#58A0D3;
	}
	.pages a.first,.pages a.prev,.pages a.next,.pages a.end{
	    margin:0;
	}
	.pages a:hover{
	    border-color:#50A8E6;
	}
	.pages span.current{
	    background:#50A8E6;
	    color:#FFF;
	    font-weight:700;
	    border-color:#50A8E6;
	}
	.table input,select{
		border-radius:6px !important;
	}
</style>
</block>
<block name="smallmenu">
<ul class="breadcrumb">
	<li>
		<i class="ace-icon fa fa-home home-icon"></i>
		<a href="{:U('Index/index')}">主页</a>
	</li>

	<li class="active">轮播图列表</li>
</ul><!-- /.breadcrumb -->

<!-- #section:basics/content.searchbox -->
<div class="nav-search" id="nav-search"><button class="btn btn-xs btn-pink" onClick='location.href="__CONTROLLER__/banner_add"'>添加轮播图</button></div>
<!-- /.nav-search -->
</block>

<block name="content">
	<input type="hidden" id="crontab-s" />

	<table id="sample-table-1" class="table table-striped table-bordered table-hover">
		<thead>
			<tr>
				<th class="center">编号</th>
			    <th class="center">名称</th>
				<th class="center">显示位置</th>
				<th class="center">迷笛club ID</th>
				<th class="center">是否显示</th>
				<th class="center"><i class="ace-icon fa fa-clock-o bigger-110 hidden-480"></i>创建时间</th>
				<th class="center">操作</th>
			</tr>
		</thead>

		<tbody>
			<foreach name="banner_arr" item="v">
			<tr style="text-align:center">
				<td>{$v.banner_id}</td>
				<td>{$v.banner_name}</td>
				<td>
					<?php if ($v['banner_position'] == 1): ?>
						首页
					<?php elseif ($v['banner_position'] == 2): ?>
						考级
					<?php elseif ($v['banner_position'] == 3): ?>
						迷笛club
					<?php endif ?>
				</td>
				<td>{$v.banner_midiclub_id}</td>
				<td>
					<?php if ($v['banner_display'] == 0): ?>
						<span style="color:red">不显示</span>
					<?php elseif ($v['banner_display'] == 1): ?>
						<span style="color:green">显示</span>
					<?php endif ?>
				</td>
				<td>{$v.banner_time}</td>
				<td>
					<div class="hidden-sm hidden-xs btn-group">
						<div class="hidden-sm hidden-xs action-buttons">

							<a data-rel="colorbox" class="cboxElement" title="{$v['banner_name']}" href="{$v['banner_pic']}">
								<i class="ace-icon fa fa-search-plus bigger-130"></i>
							</a>

							<a class="green" style='cursor:pointer' onClick='location.href="__CONTROLLER__/banner_edit/banner_id/{$v.banner_id}"' title='修改轮播图信息'>
								<i class="ace-icon fa fa-pencil bigger-130"></i>
							</a>
						</div>
					</div>
				</td>
			</tr>
		    </foreach>
		</tbody>
	</table>
<div class="pages" style="float:right">{$page}</div>
</block>
<block name="scripts">
	<script src="__PUBLIC__/assets/js/jquery.colorbox.js"></script>
</block>
<block name="jscript">
<script script="text/javascript">
    $(function(){
        $('#menu_baseinfo').addClass('active open');
        $('#menu_banner_list').addClass('active');
    });
</script>
<script type="text/javascript">
	jQuery(function($) {
		var $overflow = '';
		var colorbox_params = {
			rel: 'colorbox',
			reposition:true,
			scalePhotos:true,
			scrolling:false,
			previous:'<i class="ace-icon fa fa-arrow-left"></i>',
			next:'<i class="ace-icon fa fa-arrow-right"></i>',
			close:'&times;',
			current:'{current} / {total}',
			maxWidth:'100%',
			maxHeight:'100%',
			onOpen:function(){
				$overflow = document.body.style.overflow;
				document.body.style.overflow = 'hidden';
			},
			onClosed:function(){
				document.body.style.overflow = $overflow;
			},
			onComplete:function(){
				$.colorbox.resize();
			}
		};

		$('[data-rel="colorbox"]').colorbox(colorbox_params);
		$("#cboxLoadingGraphic").html("<i class='ace-icon fa fa-spinner orange fa-spin'></i>");//let's add a custom loading icon


		$(document).one('ajaxloadstart.page', function(e) {
			$('#colorbox, #cboxOverlay').remove();
	   });
	})
</script>
<script type="text/javascript">
			jQuery(function($) {
				var oTable1 =
				$('#sample-table-2')
				//.wrap("<div class='dataTables_borderWrap' />")   //if you are applying horizontal scrolling (sScrollX)
				.dataTable( {
					bAutoWidth: false,
					"aoColumns": [
					  { "bSortable": false },
					  null, null,null, null, null,
					  { "bSortable": false }
					],
					"aaSorting": [],

					//,
					//"sScrollY": "200px",
					//"bPaginate": false,

					//"sScrollX": "100%",
					//"sScrollXInner": "120%",
					//"bScrollCollapse": true,
					//Note: if you are applying horizontal scrolling (sScrollX) on a ".table-bordered"
					//you may want to wrap the table inside a "div.dataTables_borderWrap" element

					//"iDisplayLength": 50
			    } );
				/**
				var tableTools = new $.fn.dataTable.TableTools( oTable1, {
					"sSwfPath": "../../copy_csv_xls_pdf.swf",
			        "buttons": [
			            "copy",
			            "csv",
			            "xls",
						"pdf",
			            "print"
			        ]
			    } );
			    $( tableTools.fnContainer() ).insertBefore('#sample-table-2');
				*/


				//oTable1.fnAdjustColumnSizing();


				$(document).on('click', 'th input:checkbox' , function(){
					var that = this;
					$(this).closest('table').find('tr > td:first-child input:checkbox')
					.each(function(){
						this.checked = that.checked;
						$(this).closest('tr').toggleClass('selected');
					});
				});


				$('[data-rel="tooltip"]').tooltip({placement: tooltip_placement});
				function tooltip_placement(context, source) {
					var $source = $(source);
					var $parent = $source.closest('table')
					var off1 = $parent.offset();
					var w1 = $parent.width();

					var off2 = $source.offset();
					//var w2 = $source.width();

					if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
					return 'left';
				}

			})
		</script>

</block>